<template>
    <div>
        <nav-header><template v-slot:title>佣金明细</template></nav-header>

        <div class="fee-item" v-for="item in data">
            <div class="container-fluid">
                <div class="row">
                    <div class="col-xs-6"><p>订单号:{{item.order_code}}</p></div>
                    <div class="col-xs-6" style="text-align: right"><p>{{item.updated_at}}</p></div>
                </div>
                <div class="row">
                    <div class="col-xs-6"><p>{{item.status}}</p></div>
                    <div class="col-xs-6" style="text-align: right"><p>{{item.fee}}</p></div>
                </div>
            </div>

        </div>

    </div>
</template>
<script>
    import NavHeader from "../Layout/NavHeader";

    export default {
        components: {NavHeader},

        data() {
            return {
                data: [
                    // {
                    //     order_code: '1231',
                    //     updated_at: '1231',
                    //     status: '1231',
                    //     fee: 'fee',
                    // }
                ]
            }
        },
        created() {
        },
        mounted() {
            this.getFeeDetail();
        },
        methods: {
            getFeeDetail() {
                let that = this;
                this.api.getFeeDetail().then(res => {
                    if (res.data) {
                        that.data = res.data;
                    }
                })
            }
        },
    }
</script>
<style>

    .fee-item {
        background-color: #fff;
        border-radius: 10px;
        padding: 10px;
        margin-top: 10px;
        box-shadow: 0 3px 3px 2px #eeeeee;
    }


</style>
